<!-- html部分的头部，引入一些外部文件 -->
<!DOCTYPE html>
<html>

<head>
  <title>网页标题</title>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <!-- 一定要先加载其他的css样式，最后引入自己的样式
  这样，自己写的样式优先级才会最高 -->
  <!-- vanline评论系统 -->
  <!-- <script src='//unpkg.com/valine/dist/Valine.min.js'></script> -->
  
<script src="/libs/Valine/Valine.min.js"></script>

  
<script src="/libs/jquery-3.5.1/jquery.js"></script>

  
<link rel="stylesheet" href="/libs/bootstrap-3.3.7/css/bootstrap.css">

  
<link rel="stylesheet" href="/libs/iconfont+/icon.css">

  
<link rel="stylesheet" href="/css/global/main.css">

  
<link rel="stylesheet" href="/libs/fancybox/jquery.fancybox.min.css">

  
<link rel="stylesheet" href="/libs/animate/animate.min.css">
 
<meta name="generator" content="Hexo 4.2.1"></head>

<body>
<nav>
  <div class="nav-wrapper-wrapper">
  <!-- web端顶部的一栏，菜单条 -->
  <div class="nav-wrapper">
    <div class="show-menu-btn-wrapper visible-xs-block visible-sm-block">
      <div class="menu-btn">
        <span class="iconfont iconliebiao" id="showAsideBtn"></span>
      </div>
    </div>
    <div class="logo-wrapper">
      <a href="/">
        <img src="/favicon.ico" alt="" class="logo-img not-fancybox">
        <span class="logo-text">网页标题 </span>
      </a>
    </div>
    <div class="menu-wrapper hidden-xs hidden-sm">
      <ul id="menu">
        
        <li class="menu-item">
          <span class="iconfont iconai-home "></span>
          <a href="/">主页</a>
        </li>
        
        <li class="menu-item">
          <span class="iconfont iconbiaoqiantixi "></span>
          <a href="/tags">标签</a>
        </li>
        
        <li class="menu-item">
          <span class="iconfont iconfenlei-1 "></span>
          <a href="/categories">分类</a>
        </li>
        
        <li class="menu-item">
          <span class="iconfont iconguanyu "></span>
          <a href="/about">关于</a>
        </li>
        
        <li class="menu-item">
          <span class="iconfont iconicon-test "></span>
          <a href="/friends">友链</a>
        </li>
        
      </ul>
    </div>
    <div class="search-wrapper animated bounce" id="search-btn">
      <span class="iconfont iconsearch"></span>
    </div>
  </div>
</div>
<div class="nav-empty">
  <!-- 空内容，nav为fixed定位不占位，这个div占位用 -->
</div>
<!-- 本地搜索 -->
<div class="local-search-wrapper">
  <div class="local-search-mask">
    <div class="local-search-content">
      <div class="local-search">
        <input type="text" class="form-control" id="searchInput" placeholder="请输入搜索内容">
        <div class="icon-search-wrapper">
          <span class="iconfont iconsearch"></span>
        </div>
      </div>
      <div class="local-search-result" id="searchResult"></div>
    </div>
  </div>
</div>
<script type="text/javascript">
  $(function () {
    searchFunc("/search.xml", 'searchInput', 'searchResult');
  })
</script>
</nav>
<div id="main">
  <!-- 侧边栏 -->
  <div id="aside">
    <!-- 手机端的侧边栏，电脑端隐藏 -->
<div class="aside-wrapper">
  <div class="mobile-menu-wrapper">
    <div class="mobile-menu-logo-wrapper">
      <a href="/">
        <div class="mobile-menu-logo">
          <img src="/favicon.ico" class="not-fancybox" alt="">
        </div>
        <div class="mobile-menu-title">网页标题 </div>
      </a>
      <div class="mobile-menu-subTitle">从来没有真正的绝境，只有心灵的迷途 </div>
    </div>
    <div class="mobile-menu-menu-wrapper">
      <ul id="mobile-menu">
        
        <li class="mobile-menu-item">
          <span class="iconfont iconai-home"></span>
          <a href="/">主页</a>
        </li>
        
        <li class="mobile-menu-item">
          <span class="iconfont iconbiaoqiantixi"></span>
          <a href="/tags">标签</a>
        </li>
        
        <li class="mobile-menu-item">
          <span class="iconfont iconfenlei-1"></span>
          <a href="/categories">分类</a>
        </li>
        
        <li class="mobile-menu-item">
          <span class="iconfont iconguanyu"></span>
          <a href="/about">关于</a>
        </li>
        
        <li class="mobile-menu-item">
          <span class="iconfont iconicon-test"></span>
          <a href="/friends">友链</a>
        </li>
        
      </ul>
    </div>
    <div class="mobile-menu-social-link-wrapper">
      <ul id="mobile-menu-social">
        
        <li class="mobile-menu-socail-item">
          <!-- 悬浮显示二维码,如其他需要展示二维码的请在这里修改 -->
          
          <a href="https://github.com" target="_blank">
            <span class="iconfont icongitee "></span>
          </a>
          
        </li>
        
        <li class="mobile-menu-socail-item">
          <!-- 悬浮显示二维码,如其他需要展示二维码的请在这里修改 -->
          
          <a href="https://space.bilibili.com/319160358" target="_blank">
            <span class="iconfont icontv "></span>
          </a>
          
        </li>
        
        <li class="mobile-menu-socail-item">
          <!-- 悬浮显示二维码,如其他需要展示二维码的请在这里修改 -->
          
          <a href="http://wpa.qq.com/msgrd?v=3&uin=952008898&site=qq&menu=yes" target="_blank">
            <span class="iconfont iconqq-copy "></span>
          </a>
          
        </li>
        
        <li class="mobile-menu-socail-item">
          <!-- 悬浮显示二维码,如其他需要展示二维码的请在这里修改 -->
          
          <a class="social-weixin" href="javascript:">
            <span class="iconfont iconwe-chat-s "></span>
            <img class="qrcode not-fancybox" src="http://image.mdashen.com/pic/S00802-21052679.jpg" alt="微信二维码">
          </a>
          
        </li>
        
      </ul>
    </div>
  </div>
</div>
  </div>
  <div id="content">
    <div class="page-category-wrapper">
  
  <div class="category-group">
  <div class="category-group-title">
    <span class="iconfont iconfenlei-1"></span>
    <span class="category-group-title-text">文档分类</span>
  </div>
  <div class="category-group">
    
    <a href="/categories/hexo/ ">
      <div class="category-wrapper">
        <span class="category-text">
          hexo
        </span>
        <span class="category-number">4 </span>
      </div>
    </a>
    
    <a href="/categories/%E5%88%86%E7%B1%BB%E4%B8%80/ ">
      <div class="category-wrapper">
        <span class="category-text">
          分类一
        </span>
        <span class="category-number">2 </span>
      </div>
    </a>
    
    <a href="/categories/%E5%88%86%E7%B1%BB%E4%B8%89/ ">
      <div class="category-wrapper">
        <span class="category-text">
          分类三
        </span>
        <span class="category-number">2 </span>
      </div>
    </a>
    
    <a href="/categories/%E5%88%86%E7%B1%BB%E4%BA%8C/ ">
      <div class="category-wrapper">
        <span class="category-text">
          分类二
        </span>
        <span class="category-number">2 </span>
      </div>
    </a>
    
    <a href="/categories/%E6%B5%8B%E8%AF%95%E6%96%87%E7%AB%A0/ ">
      <div class="category-wrapper">
        <span class="category-text">
          测试文章
        </span>
        <span class="category-number">2 </span>
      </div>
    </a>
    
    <a href="/categories/%E5%88%86%E7%B1%BB-%E6%B5%8B%E8%AF%95%E6%96%87%E7%AB%A0/ ">
      <div class="category-wrapper">
        <span class="category-text">
          分类-测试文章
        </span>
        <span class="category-number">2 </span>
      </div>
    </a>
    
  </div>
</div>
  
  <!-- 该分类下所有文章 -->
  <div class="categories-article-wrapper row">
    
    <div class="article-card-wrapper col-lg-4 col-md-4 col-sm-6 col-xs-12">
        <!-- post为文章信息, 需要传递过来 -->
  <div class="article-card">
    <a href="/2020/07/typings%E4%BD%BF%E7%94%A8/ " class="article-head">
      <div class="article-bg">
        <!-- TODO 到时候换成随机图片，或者文章中的图片 -->
        <img src="/medias/banner.jpg" alt="" class="article-banner not-fancybox">
        <div class="article-title">typings使用</div>
      </div>
    </a>
    <div class="article-content">
      <div class="article-summary">
        
        <span>
          注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符
        </span>
        <!-- TODO 截取文章前多少个字符 -->
        
      </div>
    </div>
    <div class="article-subline">
      <div class="article-buildtime">2020-07-24</div>
      <div class="article-category-wrapper">
        
        <a href="/categories/%E5%88%86%E7%B1%BB%E4%B8%80/">
          <div class="article-category">
            <span class="article-category-text">分类一 </span>
          </div>
        </a>
        
      </div>
    </div>
    <div class="article-tags-wrapper">
      
      
      <a href="/tags/typings/">
        <div class="article-tag">
          <span class="article-tag-text">
            typings
          </span>
        </div>
      </a>
      
    </div>
  </div>
    </div>
    
    <div class="article-card-wrapper col-lg-4 col-md-4 col-sm-6 col-xs-12">
        <!-- post为文章信息, 需要传递过来 -->
  <div class="article-card">
    <a href="/2020/07/typings%E4%BD%BF%E7%94%A8%E7%9A%84%E5%89%AF%E6%9C%AC/ " class="article-head">
      <div class="article-bg">
        <!-- TODO 到时候换成随机图片，或者文章中的图片 -->
        <img src="/medias/banner.jpg" alt="" class="article-banner not-fancybox">
        <div class="article-title">typings使用</div>
      </div>
    </a>
    <div class="article-content">
      <div class="article-summary">
        
        <span>
          注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符注释more前面的就是摘要截取文章前多少个字符
        </span>
        <!-- TODO 截取文章前多少个字符 -->
        
      </div>
    </div>
    <div class="article-subline">
      <div class="article-buildtime">2020-07-24</div>
      <div class="article-category-wrapper">
        
        <a href="/categories/%E5%88%86%E7%B1%BB%E4%B8%80/">
          <div class="article-category">
            <span class="article-category-text">分类一 </span>
          </div>
        </a>
        
      </div>
    </div>
    <div class="article-tags-wrapper">
      
      
      <a href="/tags/typings/">
        <div class="article-tag">
          <span class="article-tag-text">
            typings
          </span>
        </div>
      </a>
      
    </div>
  </div>
    </div>
    
  </div>
</div>
<!-- 分页条 -->

  </div>
</div>
<!-- footer负责页脚，备案，统计等信息 -->
<footer>
  <div class="footer-wrapper">
  <div class="footer-copyright-wrapper">
    <span>Powered by </span><a href="https://hexo.io/" target="_blank">Hexo</a>
    |&nbsp;<span>Theme</span>&nbsp;<a href="https://gitee.com/yishen_yishen/hexo-yishen"
      target="_blank">Hexo-theme-yishen</a>
  </div>
  <!-- 原谅我写拼音，想不到其他好的词 -->
  <div class="footer-tongji-wrapper">
    <span>
      <span class="iconfont"></span>
      站点总字数:&nbsp;666字&nbsp;|
      <span class="iconfont"></span>
      总访问量pv:&nbsp;<span id="busuanzi_value_site_pv"></span>&nbsp;|
      <span class="iconfont"></span>
      总访问人数uv:&nbsp;<span id="busuanzi_value_site_uv"></span>
    </span>
  </div>
  
  <div class="footer-icp-wrapper">
    <img src="/medias/icp.png" alt="" class="not-fancybox">
    <a href="http://beian.miit.gov.cn/" target="_blank">
      闽ICP备19004187号-1
    </a>
  </div>
  
</div>
</footer>
<!-- foot.ejs负责引入一些js脚本 -->
<!-- 整个html部分的底部 -->

<script src="/libs/bootstrap-3.3.7/js/bootstrap.js"></script>


<script src="/libs/busuanzi/busuanzi.pure.mini.js"></script>


<script src="/libs/fancybox/jquery.fancybox.min.js"></script>

<!-- animate梵高main.js前面，main中要使用animate中的方法 -->

<script src="/js/animate.js"></script>
 

<script src="/js/main.js"></script>


<script src="/js/search.js"></script>


<script src="/js/fancybox.js"></script>

</body>

</html>